<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>my demo</title>

		<link rel="stylesheet" href="css/bootstrap.3.4.1.css">
		<link rel="stylesheet" href="css/main.css">
	</head>
	<body>


		<div class="navbar navbar-default">

			<div class="container">

				<div class="navbar-header">


					<div class="navbar-brand"><img src="img/logo.jpg"></div>
				</div>

				<ul class="nav navbar-nav">
					<li><a href="#">栓蛋-头条</a></li>
					<li><a href="#">国内</a></li>
					<li><a href="#">国际</a></li>
					<li><a href="#">社会</a></li>
					<li><a href="#">军事</a></li>
					<li><a href="#">财务</a></li>

				</ul>


				<ul class="nav navbar-nav navbar-right">

					<li><a href="#">登录</a></li>
					<li><a href="#">注册</a></li>

				</ul>



			</div>


		</div>

		<div class="container">


			<div class="col-xs-2  side-bar">



				<div class="list-group">
					<a href="#" class="list-group-item active">
						全部
					</a>
					<a href="#" class="list-group-item">头条</a>
					<a href="#" class="list-group-item">八卦</a>
					<a href="#" class="list-group-item">电影</a>
					<a href="#" class="list-group-item">电视剧</a>
					<a href="#" class="list-group-item">明星</a>
					<a href="#" class="list-group-item">音乐</a>
					<a href="#" class="list-group-item">演员</a>
					<a href="#" class="list-group-item">歌手</a>
				</div>



			</div>








			<div class="col-xs-7 main-contanier">


				<div class="article-list clearfix ">

					<div class="article  clearfix  ">
						<img src="img/2-3.jpg" alt="图片">
						
						<div class="art-right">
							<span class="art-title">某著名高校女生貌美如花被潜规则，目前女生情绪稳定</span>
							<div class="art-comment">
								
								王花花 - 348评论- 8分钟前
								
							</div>
							
						</div>
				

					</div>

					
					
					<div class="article  clearfix  ">
						<img src="img/2-3.jpg" alt="图片">
						
						<div class="art-right">
							<span class="art-title">某著名高校女生貌美如花被潜规则，目前女生情绪稳定</span>
							<div class="art-comment">
								
								王花花 - 348评论- 8分钟前
								
							</div>
							
						</div>
									
					
					</div>
					
					
					
					<div class="article  clearfix ">
						<img src="img/2-3.jpg" alt="图片">
						
						<div class="art-right">
							<span class="art-title">某著名高校女生貌美如花被潜规则，目前女生情绪稳定</span>
							<div class="art-comment">
								
								王花花 - 348评论- 8分钟前
								
							</div>
							
						</div>
									
					
					</div>
					
					

				</div>




			</div>




			<div class="col-xs-3">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum esse illum aliquid
				amet sint tempore harum eveniet illo voluptatum ipsa in similique maxime quam? Quisquam maxime cumque
				sapiente sit sed?</div>


		</div>
	</body>
</html>
